import React, { useEffect, useLayoutEffect, useRef, useState } from 'react'
import { Button, Cascader, Checkbox, Dialog, Form, ImageUploader, ImageUploadItem, Input, Modal, Picker, SearchBar, TextArea, Toast } from 'antd-mobile'
import Styles from './index.less'
import List from '@/components/List'
import { useDebounce } from 'ahooks'
export default function index() {
  const [searchValue, setSearchValue] = useState('')
  const debounceValue = useDebounce(searchValue, { wait: 600 })

  return (
    <>
      <div className={Styles.container}>
        <SearchBar
          placeholder="输入关键字"
          clearable
          value={searchValue}
          className={Styles.search}
          onChange={(val) => {
            setSearchValue(val)
          }}
        />
        <div className={Styles.content}>
          <div className={Styles.actorList}>
            <List search={debounceValue}></List>
          </div>
        </div>
      </div>
    </>
  )
}
